
<template>
  <div class="app-container">
     <div class="sc" v-show="tname"><h3> <div class="avatar-wrapper">
        <img  v-show="avatar" class="user-avatar" v-bind:src="avatar">

      </div>{{tname}}，感谢您使用监控管理后台。</h3></div>

    </div>
</template>

<script>

export default {
  name: 'home',
  data () {
    return {

      avatar: '',
      name: '',
      sh1: '',
      sh2: '',
      sh3: '',
      ip2018: '',
      tname: ''

    }
  },

  created () {
    this.avatar = this.$store.state.user.avatar
    this.tname = this.$store.state.user.name
  },
  mounted () {

  },
  methods: {
    to_client () {
      this.$router.push({name: 'users'
      })
    },
    to_zhoubao () {
      this.$router.push({name: 'weeks'
      })
    },
    to_board () {
      this.$router.push({name: 'board'
      })
    },
    to_in () {
      this.$router.push({name: 'tip'
      })
    },
    to_guzhang () {
      this.$router.push({name: 'faults'
      })
    },
    to_sy () {
      this.$router.push({name: 'headline'
      })
    },

    fetchname () {

    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
 .app-container{ padding: 10px;height: 100% }
 .sc{ padding: 10px; text-align: center;}
 .user-avatar {
        width: 48px;
        height: 48px;
        border-radius: 50%;
      }
</style>
